import { PageContainer } from '@ant-design/pro-layout';
import React from 'react';
import {Button, Card,Modal,Radio,Input, message} from 'antd'
import {UseTable,UseSearch} from '../../../components'
import InnovationStudioController from '@/services/InnovationStudio/InnovationStudioController';
const {confirm} = Modal
const {TextArea} = Input
class Members extends React.Component {
    constructor(props) {
        super(props);
        let userInfo = JSON.parse(sessionStorage.getItem('userInfo'))
        this.state = { 
            childData:props.rows,
            userInfo:userInfo,
            datas:{},
            refresh:false
         };
    }

    getList=(query)=>{
        let {childData} = this.state
        query.studioCode = childData.studioCode
        return InnovationStudioController.getMembersPage(query)
    }
    showModal=(rowData)=>{
        this.setState({
            rowData,
            visible:true
        })
    }
    agreeSubmit=()=>{
        let {datas,userInfo,rowData} = this.state
        let that=this
        if(!datas.result){
            message.error('审批意见未选择',2)
            return
        }
        let params={
            ...datas,
            studioCode:rowData.studioCode,
            name:rowData.name,
            userName:rowData.userName,
            reviewName:userInfo.name,
            reviewUserName:userInfo.userName

        }
        confirm({
            title:'提示',
            content:<span>确定要{datas.result}<span style={{color:'red'}}>{rowData.name}</span>的加入吗？</span>,
            onOk(){
                InnovationStudioController.agreementNewMember(params).then(r=>{
                    if(r&&r.data===1){
                        message.success('提交成功')
                        that.setState({visible:false})
                        that.freshen()
                    }else{
                        message.error('提交失败，请联系管理员')
                    }
                })
            }
        })
    }
    setLeader=(rowData)=>{
        let that = this
        let {userInfo} = this.state
        confirm({
            title:'提示',
            content:<span>确定要将<span style={{color:'red'}}>{rowData.name}</span>设置为办公室负责人吗？</span>,
            onOk(){
                InnovationStudioController.changeLeader({studioLeaderName:rowData.name,studioLeaderUserName:rowData.userName,studioCode:rowData.studioCode,userName:userInfo.userName}).then(r=>{
                    if(r&&r.data===1){
                        message.success('设置成功')
                        that.props.onCancel()
                        that.freshen()
                    }
                    else{
                        message.error('提交失败，请联系管理员')
                    }
                })
            }
        })
    }
    handleSearch=(query)=>{
        this.setState({query})
        this.freshen()
    }
    reset=()=>{
        this.setState({query:{}})
        this.freshen()
    }
    handleChange=(key,e)=>{
        let {datas} = this.state
        datas[key] =e.target.value
        this.setState({datas})
    }
    freshen=()=>{
        this.setState({refresh:!this.state.refresh})
    }
    render() {
        const {query,visible,refresh,rowData} = this.state
        const columns=[
            {title:'工号',dataIndex:'userName',align:'center'},
            {title:'姓名',dataIndex:'name',align:'center'},
            {title:'省级部门',dataIndex:'provinceDepartmentName',align:'center'},
            {title:'市级部门',dataIndex:'cityDepartmentName',align:'center'},
            {title:'申请时间',dataIndex:'createdAt',align:'center'},
            {title:'是否工作室负责人',dataIndex:'isLeader',align:'center',render:text=>text==='是'?'是':'否'},
            {title:'状态',dataIndex:'reviewStatus',align:'center'},
            {title:'操作',align:'center',render:(text,rowData)=><span>
                {rowData.isLeader!=='是'&&<span>
                {rowData.reviewStatus==='同意'&&<Button onClick={this.setLeader.bind(this,rowData)} type={'primary'} style={{margin:5}}>设为负责人</Button>}
                {rowData.reviewStatus==='待审批'&&<Button onClick={this.showModal.bind(this,rowData)} type={'primary'} style={{margin:5}}>审批</Button>}
                {rowData.reviewStatus==='同意'&&<Button onClick={this.showModal.bind(this,rowData)} type={'danger'} style={{margin:5}}>移出</Button>}
                </span>}
                </span>}
        ]
        const searchItem=[
            {name:'员工姓名',keyName:'name',valueType:'text'},
            {name:'员工编号',keyName:'userName',valueType:'text'},
            {name:'状态',keyName:'reviewStatus',valueType:'select',selectDatas:[{code:'待审核',name:'待审核'},{code:'同意',name:'同意'},{code:'不同意',name:'不同意'},{code:'移出',name:'移出'}]},
        ]
        return (
            <div>
                <Card>
                    <UseSearch searchItem={searchItem} handleSearch={this.handleSearch} reset={this.reset} />
                </Card>
                <Card>
                    <UseTable columns={columns} getData={this.getList} query={query} refresh={refresh} />
                </Card>
                {visible&&<Modal
                visible={visible}
                title={'审批'}
                onCancel={()=>this.setState({visible:false})}
                onOk={this.agreeSubmit}
                >
                    <div>
                        <strong>意见：</strong>
                        <Radio.Group onChange={this.handleChange.bind(this,'result')}>
                            {rowData.reviewStatus==='待审批'&&<Radio value={"同意"} key={1}>同意</Radio>}
                            {rowData.reviewStatus==='待审批'&&<Radio value={"不同意"} key={2}>不同意</Radio>}
                            {rowData.reviewStatus==='同意'&&<Radio value={"移出"} key={3}>移出</Radio>}
                        </Radio.Group>
                    </div>
                    <div>
                        <strong style={{verticalAlign:"top"}}>备注：</strong>
                        <Input.TextArea placeholder="请输入" onChange={this.handleChange.bind(this,'remark')} style={{width:350}}></Input.TextArea>
                    </div>
                </Modal>}
            </div>
        );
    }
}

export default Members;